const { Select, Form, Input, Button } = antd;

const days = Array.from({ length: 7 }, (_, index) => index).map(item => (
    <Select.Option key={item} value={item + 1}>
        {item + 1}
    </Select.Option>
));

function Load() {
    const { loading: loadingOfTeacherList, data: teacherList = [] } = useRequest(
        () => {
            return new Promise(resolve => {
                request
                    .get('/teacher/teacherList')
                    .then(res => {
                        console.log(res);
                        resolve(Array.isArray(res) ? res : []);
                    })
                    .catch(err => {
                        resolve([]);
                        message.error(err.message);
                        console.log(err);
                    });
            });
        },
        {
            manual: false,
        }
    );

    const { loading: loadingOfClassRoomList, data: classRoomList = [] } = useRequest(
        () => {
            return new Promise(resolve => {
                request
                    .get('/classroom/classroomList')
                    .then(res => {
                        console.log(res);
                        resolve(Array.isArray(res) ? res : []);
                    })
                    .catch(err => {
                        resolve([]);
                        message.error(err.message);
                        console.log(err);
                    });
            });
        },
        {
            manual: false,
        }
    );

    const { loading: addScheduleLoading, run: modifySchedule } = useRequest(
        values => {
            const params = qs.parse(location.search);
            console.log(params, values);
            return new Promise(resolve => {
                request
                    .get(
                        `/classSchedule/updateSchedule?${qs.stringify({
                            ...values,
                            id: params.id,
                        })}`
                    )
                    .then(res => {
                        console.log(res);
                        if (typeof res === 'boolean') {
                            if (res) {
                                message.success('添加成功');
                            } else {
                                message.error('添加失败，请检查是否有课程冲突');
                            }
                        } else {
                            message.error('服务器出现错误');
                        }
                    })
                    .catch(err => {
                        message.error(err.message);
                        console.log(err);
                    });
            });
        },
        {
            manual: true,
        }
    );

    return (
        <div style={{ display: 'flex', flexDirection: 'column', justifyContext: 'center', alignItems: 'center' }}>
            <Form
                onFinish={values => {
                    modifySchedule(values);
                }}
                layout='vertical'
                style={{ width: 300 }}>
                <Form.Item label='教师' name='teacherId'>
                    <Select allowClear>
                        {teacherList.map(item => (
                            <Select.Option key={item.no} value={item.no}>
                                {item.name}
                            </Select.Option>
                        ))}
                    </Select>
                </Form.Item>

                <Form.Item label='教室' name='classroomId'>
                    <Select allowClear>
                        {classRoomList.map(item => (
                            <Select.Option key={item.id} value={item.id}>
                                {item.name}@{item.position}
                            </Select.Option>
                        ))}
                    </Select>
                </Form.Item>

                <Form.Item
                    label='周'
                    name='week'
                    rules={[
                        {
                            validateTrigger: 'submit',
                            validator(_, value) {
                                console.log(_, value);
                                return new Promise((resolve, reject) => {
                                    var v = Number.parseInt(Number(value));
                                    if (Number.isNaN(v)) {
                                        return reject('请输入正确的周次');
                                    }
                                    if (v <= 0 || v > 20) {
                                        return reject('请输入1-20之间的数字');
                                    }
                                    return resolve();
                                });
                            },
                        },
                    ]}>
                    <Input />
                </Form.Item>

                <Form.Item label='天' name='day'>
                    <Select>{days}</Select>
                </Form.Item>

                <Form.Item label='节' name='section'>
                    <Select>
                        <Select.Option key='1' value={1}>
                            第一节
                        </Select.Option>
                        <Select.Option key='3' value={3}>
                            第二节
                        </Select.Option>
                        <Select.Option key='5' value={5}>
                            第三节
                        </Select.Option>
                        <Select.Option key='7' value={7}>
                            第四节
                        </Select.Option>
                    </Select>
                </Form.Item>
                <Form.Item>
                    <Button type='primary' htmlType='submit'>
                        修改
                    </Button>
                    <Button htmlType='reset'>重置</Button>
                </Form.Item>
            </Form>
        </div>
    );
}
